<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/index.css">
		<link rel="stylesheet" type="text/css" href="../css/general.css"/>
		<link rel="stylesheet" type="text/css" href="css/compatible.css"/>
		<style type="text/css">
			.main-title img {
			    display: inline-block;
			    width: auto !important;
			    margin-right: 10px;
			    height: auto !important;
			    vertical-align: middle;
			}
			.business-entry-img{
				margin: 0.4em;
			}
			.business-entry-img img {
			    display: block;
			    width: 30px;
			    height: 30px;
			    margin: 0 auto;
			}
			#content{
				background-color: white;
			}
			*{
				font-family: "微软雅黑";
				color: #2f2f2f;
				font-size: 0.9em;
			}
			.business-entry li p {
			    /*font-size: 0.9em;*/
			    line-height: 24px;
			    color: rgb(16,16,16);
			    margin-bottom: 0;
			}
			.business-entry li div {
			    /*font-size: 0.9em;*/
			    line-height: 24px;
			    color: rgb(16,16,16);
			    margin-bottom: 0;
			}
			
			
			.div8{
				width: 100%;
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				flex-wrap: wrap;
			}
			.div8>div{
				width: 33.3%;
				padding: 0.3em;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				background-color: white;
			}
			.div8>div>div{
				white-space: nowrap;
				font-size: 1.1em;
			}
			
			.mainimg{
				width: 30px;
				height: 30px;
				margin: 0.4em;
			}
			.mainimg>img{
				width: 100%;
				height: 100%;
			}
			
			
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
		    <h1 class="mui-title">统计</h1>
		</header>
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
			<div class="mui-scroll">
		
			<section class="main-title container"><img src="images/time.png" alt="" /><span>本月累计</span></section>
			<section class="mui-conent business-tab text-center">
				<ul class="mui-row" id="showid">
					<li class="mui-col-xs-4">
						<p>消费(元)</p>
						<h4>0</h4>
						<p>0笔</p>
					</li>
					<li class="mui-col-xs-4">
						<p>充值(元)</p>
						<h4>0</h4>
						<p>0笔</p>
					</li>
					<li class="mui-col-xs-4">
						<p>会员(个)</p>
						<h4>0</h4>
						<p>累计0个</p>
					</li>
				</ul>
			</section>
			<!--
            	作者：592176224@qq.com
            	时间：2019-04-23
            	描述：
			<div class="business-entry">
            -->
				
				
				<div class="div8">
					<div class="" id="financial" ><div class="mainimg">
			    	<img src="images/xftj.png"/>
			    	</div><div id="">财务统计</div></div>
			    	
			    	<div class="" id="profit" ><div class="mainimg">
			    	<img src="images/lrtj.png"/>
			    	</div><div id="">利润统计</div></div>
			    	
			    	<div class="" id="member" ><div class="mainimg">
			    	<img src="images/hytj.png"/>
			    	</div><div id="">会员统计</div></div>
			    	
			    	<div class="" id="passengerflow" ><div class="mainimg">
			    	<img src="images/hygl.png"/>
			    	</div><div id="">客流统计</div></div>
			    	
			    	<div class="" id="timescount" ><div class="mainimg">
			    	<img src="images/jctj.png"/>
			    	</div><div id="">计次统计</div></div>
			    	
			    	<div class="" id="sale"><div class="mainimg">
			    	<img src="images/xstj.png"/>
			    	</div><div id="">销售统计</div></div>
			    	
			    	<div class="" id="commodity" ><div class="mainimg">
			    	<img src="images/sptj.png"/>
			    	</div><div id="">商品统计</div></div>
			    	
			    	<div class="" id="coupon"><div class="mainimg">
			    	<img src="images/documents.png"/>
			    	</div><div id="">优惠券统计</div></div>
			    	
			    	<div class="" id="cart" ><div class="mainimg">
			    	<img src="images/123456.png"/>
			    	</div><div id="">卡项统计</div></div>
			    	<!--
                    	作者：592176224@qq.com
                    	时间：2019-04-16
                    	描述：
			    	<div class="" onclick="gopage('consumption')"><div class="mainimg">
			    	<img src="images/cwtj.png"/>
			    	</div><div id="">消费统计</div></div>
                    -->
				</div>
			</div>
		<!--
        	作者：592176224@qq.com
        	时间：2019-04-23
        	描述：
			</div>
        -->
		</div>
	</body>
	<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/mui.min.js"></script>
	<script src="../js/req.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/muishow.js" type="text/javascript" charset="utf-8"></script>
	
	<script type="text/javascript">
		
		
		mui.ready(function (){
			mui.init({
                        	pullRefresh : {
						    container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
						    down : {
						      height:50,//可选,默认50.触发下拉刷新拖动距离,
						      auto: false,//可选,默认false.首次加载自动下拉刷新一次
						      contentdown : "下拉可以刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
						      contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
						      contentrefresh : "正在刷新...",//可选，正在刷新状态时，下拉刷新控件上显示的标题内容
						      callback :function (){
						      		console.log("下拉");
						      		getshow();
						      		mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
						      }
						    },
						  }
                        });
                        
            g("financial").addEventListener("tap",function(){
            	gopage('financial')
            })
            g("profit").addEventListener("tap",function(){
            	gopage('profit');
            })
            g("member").addEventListener("tap",function(){
            	gopage('member');
            })
            g("passengerflow").addEventListener("tap",function(){
            	gopage('passengerflow');
            })
            g("timescount").addEventListener("tap",function(){
            	 gopage('timescount');
            })
            g("commodity").addEventListener("tap",function(){
            	gopage('commodity');
            })
            g("coupon").addEventListener("tap",function(){
            	 gopage('coupon');
            })
            g("cart").addEventListener("tap",function(){
            	gopage('cart');
            })
            g("sale").addEventListener("tap",function(){
            	gopage('sale');
            })
			getshow();
		})
		function getshow(){
        	var rlist = [];
        	var data = {
        		url:"/api/order/today_gather",
        		data:{
        			access_token:acctoken(),
					date : 'month'
        		}
        	}
        	ajax(data,function(res){
        		console.log(res);
        		rlist.push(res.data);
        		var data2 = {
        			url:"/api/recharge/today_gather",
            		data:{
            			access_token:acctoken(),
						
            		}
        		}
        		ajax(data2,function(res2){
        			console.log(res2)
        			rlist.push(res2.data);
        			var data3 = {
        				url:"/api/member/gather",
        				data:{
        					access_token:acctoken(),
							
        				}
        			}
        			ajax(data3,function(res3){
        				console.log(res3);
        				rlist.push(res3.data);
        				setshow(rlist);
        				
        			})
        		})
        	})
                    	
            }
		function setshow(list){
                    	//console.log("三组信息",list);
						var str = '<li class="mui-col-xs-4"><p>消费(元)</p>'+
						'<h4>'+list[0].today_money+'</h4>'+
						'<p>'+list[0].today_count+'笔</p>'+
					'</li><li class="mui-col-xs-4"><p>充值(元)</p>'+
						'<h4>'+list[1].today_money+'</h4>'+
						'<p>'+list[1].today_count+'笔</p>'+
					'</li><li class="mui-col-xs-4"><p>会员(个)</p>'+
						'<h4>'+list[2].today_count+'</h4>'+
						'<p>累计'+list[2].all_count+'个</p></li>'
					
						
                    	g("showid").innerHTML = str;
        }
		function gopage(url){
			mui.openWindow({
			    url: url +'.html', 
			    id: url
			 });
		}
		
		/*
		 * <ul class="mui-row text-center">
					<li class="mui-col-xs-4" onclick="gopage('financial')">
						<div class="business-entry-img"><img src="images/xftj.png" alt=""></div> <!-- cwtj -->
						<div>财务统计</div>
					</li>
					<li class="mui-col-xs-4"  onclick="gopage('profit')">
						<div class="business-entry-img"><img src="images/lrtj.png" alt=""></div>
						<div>利润统计</div>
					</li>
					<!-- <li class="mui-col-xs-4" onclick="gopage('consumption')">
						<div class="business-entry-img"><img src="images/cwtj.png" alt=""></div>
						<p>消费统计</p>
					</li> -->
					<li class="mui-col-xs-4" onclick="gopage('member')">
						<div class="business-entry-img"><img src="images/hytj.png" alt=""></div>
						<div>会员统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('passengerflow')">
						<div class="business-entry-img"><img src="images/hygl.png" alt=""></div>
						<div>客流统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('timescount')">
						<div class="business-entry-img"><img src="images/jctj.png" alt=""></div>
						<div>计次统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('sale')">
						<div class="business-entry-img"><img src="images/xstj.png" alt=""></div>
						<div>销售统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('commodity')">
						<div class="business-entry-img"><img src="images/sptj.png" alt=""></div>
						<div>商品统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('coupon')">
						<div class="business-entry-img"><img src="images/documents.png" alt=""></div>
						<div>优惠券统计</div>
					</li>
					<li class="mui-col-xs-4" onclick="gopage('cart')">
						<div class="business-entry-img"><img src="images/documents.png" alt=""></div>
						<div>卡项统计</div>
					</li>
				</ul>
		 */
	</script>
</html>


